import React, { ReactNode, useContext } from 'react'
import { useSetState } from 'ahooks'
import { SetState } from 'ahooks/es/useSetState'

interface State {
	title: string
}
type IContext = {
	state: State
	setState: SetState<State>
	getState: () => void
}
export const Context = React.createContext<IContext | undefined>(undefined)
Context.displayName = 'Context'
const Provider = ({ children }: { children: ReactNode }) => {
	const [state, setState] = useSetState<State>({
		title: '标题'
	})
	const getState = () => {
		console.log('state', state)
	}
	return (
		<React.Fragment>
			<Context.Provider
				children={children}
				value={{
					state,
					setState,
					getState
				}}
			/>
		</React.Fragment>
	)
}
export default Provider

// hooks
export const useMineContext = () => {
	const context = useContext(Context)
	if (!context) throw new Error('error')
	return context
}
